.form-container {
  padding: 5px;
  height: 100%;
  overflow-y: auto;
  border-radius: 15px;
  margin: 15px auto;

  &.phone {
    overflow: hidden;
    width: 375px;
    background-color: #fff;
    border-top-left-radius: 40px;
    border-top-right-radius: 40px;
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
    box-shadow: 1px 2px 20px rgba(0, 0, 0, 0.2);
    display: flex;
    flex-direction: column;

    .mobile-head {
      height: 40px;
      position: relative;

      &:before {
        position: absolute;
        content: "";
        width: 11px;
        height: 11px;
        border-radius: 50%;
        border: 1px solid #DFE0E1;
        left: 50%;
        margin-left: -5px;
        top: 0px;
        transform: scale(1.5);
      }

      &:after {
        width: 40px;
        height: 8px;
        border: 1px solid #DFE0E1;
        position: absolute;
        content: "";
        bottom: 10px;
        left: 50%;
        margin-left: -20px;
        border-radius: 22px;
        transform: scale(1.5);
      }
    }

    .mobile-content {
      border: 1px solid #E2E3E4;
      flex: 1;
      max-height: 500px;
      overflow-y: auto;

      .phone-bar {
        background-image: url();
        background-size: 100% 14px;
        height: 14px;
        width: 100%;
        margin: 5px 0 0 0;
      }

      .phone-screen {
        min-height: 200px;
        padding: 10px;
        overflow-y: scroll;
        overflow-x: hidden;
      }
    }

    .mobile-foot {
      height: 80px;
      position: relative;

      &:after {
        position: absolute;
        content: "";
        width: 30px;
        height: 30px;
        border: 1px solid #DFE0E1;
        border-radius: 50%;
        margin-left: -15px;
        left: 50%;
        top: 24px;
        transform: scale(1.5);
      }
    }
  }
}